<template>
    <div class="wap-body">
        <div class="container-fluid">
            <div class="row">
                <div class="col-xs-12 my-col">
                    <div class="panel panel-success">
                        <div class="panel-heading">
                            <img class="img-circle logo-img" src="../assets/images/logo.png"/>
                            <span>农产品溯源系统</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12 my-col">
                    <img class="img-product" :src="profileimg">
                </div>
            </div>

            <table class="table table-hover">
                <tbody>
                <tr>
                    <td style="color: green;">品种名称：</td>
                    <td>{{name}}</td>
                </tr>
                <tr>
                    <td style="color: green;">扫描次数：</td>
                    <td>{{times}}次</td>
                </tr>
                <tr>
                    <td style="color: green;">生产商：</td>
                    <td>{{company}}</td>
                </tr>
                <tr>
                    <td style="color: green;">生产地：</td>
                    <td>{{address}}</td>
                </tr>
                <tr>
                    <td style="color: green;">生产日期：</td>
                    <td>{{startTime}}</td>
                </tr>
                <tr>
                    <td style="color: green;">保质期：</td>
                    <td>{{usableTime}}</td>
                </tr>
                </tbody>
            </table>

            <div style="margin-top: -15px;">
                <hr>
                <div style="color: green;margin-top: -10px;">&nbsp; 品种简介：</div>
                <p class="product-info">
                    {{info}}
                </p>
            </div>
        </div>
        <div :class="{ 'not-active': isNotActive, 'is-active': !isNotActive }">
            二维码未激活
        </div>
    </div>
</template>

<script>
    require('../assets/css/viewModels/wap.less');
    module.exports = {
        data: function () {
            return {
                name: '未知',
                times: '未知',
                company: '未知',
                address: '未知',
                startTime: '未知',
                usableTime: '未知',
                info: '未知',
                profileimg: '',
                isNotActive: false
            }
        },
        ready: function () {
            var _this = this;
            var code = this.$route.params.code;
            $.post('/QRcode/QRcodeScan2', {"code": code}).then(function (data) {
                if (data.status == 'success') {
                    _this.name = data.content.name;
                    _this.times = data.content.times;
                    _this.company = data.content.company;
                    _this.address = data.content.address;
                    _this.startTime = data.content.startTime;
                    _this.usableTime = data.content.usableTime;
                    _this.info = data.content.info;
                    _this.profileimg = data.content.profileimg;
                }
                else {
                    _this.isNotActive = true;
                }

            });


        }
    }
</script>